<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
  <title>房掌柜-新增酒店-标注位置</title>
  <link rel="stylesheet" href="../../css/bootstrap.font.min.css"/>
  <link rel="stylesheet" href="../../css/forms.min.css"/>
  <link rel="stylesheet" href="../../css/style.css"/>
</head>
<body ng-controller="productAdd">
<nav class="navbar navbar-inverse navbar-fixed-top to-nav">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
      </button>
      <a class="navbar-brand to-brand" href="#"><i class="fa fa-weixin fa-fw"></i>&nbsp;&nbsp;SZG 后台管理系统</a>
    </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav navbar-right">
        <li class="dropdown">
          <a href="javascript:" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
            <i class="fa fa-gear"></i>&nbsp;Mr Toma&nbsp;<span class="caret"></span>
          </a>
          <ul class="dropdown-menu">
            <li><a href="#">个人信息</a></li>
            <li><a href="#">修改密码</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">退出系统</a></li>
          </ul>
        </li>
      </ul>
    </div><!-- navbar-collapse -->
  </div>
</nav>
<!-- 菜单 start -->
<aside class="sidebar_left">
  <div class="sidebar_content">
    <ul class="nav">
      <li class="active">
        <a href="#" class="nav-link"><i class="fa fa-group"></i>产品管理</a>
        <ul class="link-lop">
          <li><a href="javascript:">周边游</a></li>
          <li><a href="javascript:">国内游</a></li>
          <li><a href="javascript:">出境游</a></li>
          <li><a href="javascript:">赴台游</a></li>
        </ul>
      </li>
      <li><a href="#" class="nav-link"><i class="fa fa-wrench"></i>网站设置</a></li>
    </ul>
  </div>
</aside>
<!-- 菜单 end -->
<section class="content">
  <div class="con-wap">
    <!-- view start -->

    <ol class="breadcrumb border">
      <li><a href="#">产品管理</a></li>
      <li><a href="#">房掌柜</a></li>
      <li><a href="#">新增酒店</a></li>
      <li class="active">标注位置</li>
    </ol>

    <form action="#" class="" name="proForm" id="proForm">
    <article class="panel panel-default">
      <header class="panel-heading p20">
        <h3 class="no-m">标注位置</h3>
      </header>
      <article class="panel-body p20 admin-form app-form">
        <div class="displayt mb20">
          <div class="cell">酒店地址：</div>
          <div class="cell">
            <input type="text" class="form-control" placeholder="国家/关键字" value="中国">
          </div>
          <div class="cell">
            <select name="" id="province" class="form-control" onchange="amapAdcode.createCity(this.value)" ><option>-省-</option></select>
          </div>
          <div class="cell">
            <select name="" id="city" class="form-control" onchange="amapAdcode.createDistrict(this.value)"><option>-市-</option></select>
            <select name="" id="district" hidden></select>
          </div>
          <div class="cell"><input type="text" class="form-control" placeholder="详细地址" id="tipinput"></div>
        </div>
        <!-- 地图 -->
        <div id="container" style="width:100%; height: 300px"></div>
      </article>
      <article class="panel-body p20 admin-form">
        <h4 class="mb15">产品介绍</h4>
        <div class="bg-glow p20 border mb20">

          <h4 class="mb20">酒店设施：</h4>
          <div class="mb15">
            <h5 class="mb15">1.酒店服务</h5>
            <label class="option option-primary mb15 mb15">
              <input type="checkbox" name="payment" checked>
              <span class="checkbox"></span>停车场</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>无线上网公共区域</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>会议厅</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>行李存放</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>会议厅</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>无线上网公共区域</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>会议厅</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>行李存放</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>会议厅</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>无线上网公共区域</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>会议厅</label>


            <h5 class="mb15">2.休闲设施</h5>
            <label class="option option-primary mb15 mb15">
              <input type="checkbox" name="payment" checked>
              <span class="checkbox"></span>停车场</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>无线上网公共区域</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>会议厅</label>

            <label class="option option-primary mb15">
              <input type="checkbox" name="payment">
              <span class="checkbox"></span>行李存放</label>
          </div>

          <div class="section">
            <label class="field prepend-icon">
              <textarea class="gui-textarea" name="" placeholder="营业时间"></textarea>
              <label class="field-icon">
                <i class="fa fa-comments"></i>
              </label>
            </label>
          </div>

          <label class="field prepend-icon">
            <textarea class="gui-textarea" name="" placeholder="酒店介绍"></textarea>
            <label class="field-icon">
              <i class="fa fa-comments"></i>
            </label>
          </label>
        </div>

        <h4 class="mb15">预定须知</h4>
        <div class="bg-glow p20 border mb20">
          <div class="section">
            <label class="field prepend-icon">
              <textarea class="gui-textarea" name="" placeholder="费用说明"></textarea>
              <label class="field-icon">
                <i class="fa fa-comments"></i>
              </label>
            </label>
          </div>

          <label class="field prepend-icon">
            <textarea class="gui-textarea" name="" placeholder="销售备注"></textarea>
            <label class="field-icon">
              <i class="fa fa-comments"></i>
            </label>
          </label>
        </div>

        <h4 class="mb15">退款说明</h4>
        <div class="bg-glow p20 border">
          <label class="field prepend-icon">
            <textarea class="gui-textarea" name="" placeholder="退改规则"></textarea>
            <label class="field-icon">
              <i class="fa fa-comments"></i>
            </label>
          </label>
        </div>


      </article>

      <div class="panel-footer p20 text-right">
        <button type="button" class="btn btn-default w120 btn-lg">返回</button>
        <button type="submit" class="btn btn-warning w160 btn-lg" ng-disabled="proForm.$invalid">保存并下一步</button>
      </div>
    </article>
    </form>

    <div class="h360"></div>
    <!-- view end -->
  </div>
</section>


<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=849cc80fad32ee884e53eedc74e0b2b9&plugin=AMap.Autocomplete,AMap.PlaceSearch,AMap.DistrictSearch"></script>
<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>

<script src="../../lib/jquery.min.js"></script>
<script src="../../js/sea.js"></script>
<script src="../../js/main.js"></script>
<script>
  var map = new AMap.Map('container', {
    resizeEnable: true,
    center: [116.30946, 39.937629],
    zoom: 10
  });

  var amapAdcode = {};
  amapAdcode._district = new AMap.DistrictSearch({//高德行政区划查询插件实例
    subdistrict: 1   //返回下一级行政区
  });
  amapAdcode.createSelectList = function(selectId, list) {//生成下拉列表
    var selectList = document.getElementById(selectId);
    selectList.innerHTML = '';
    selectList.add(new Option('--请选择--'));
    for (var i = 0, l = list.length, option; i < l; i++) {
      option = new Option(list[i].name);
      option.setAttribute("value", list[i].adcode)
      selectList.add(option);
    }
  };
  amapAdcode.search = function(adcodeLevel, keyword, selectId) { //查询行政区划列表并生成相应的下拉列表
    var me = this;
    if (adcodeLevel == 'district'|| adcodeLevel == 'city') { //第三级时查询边界点
      this._district.setExtensions('all');
    }
    this._district.setLevel(adcodeLevel); //行政区级别
    this._district.search(keyword, function(status, result) { //注意，api返回的格式不统一，在下面用三个条件分别处理
      var districtData = result.districtList[0];
      if (districtData.districtList) {
        me.createSelectList(selectId, districtData.districtList);
      } else if (districtData.districts) {
        me.createSelectList(selectId, districtData.districts);
      } else {
        document.getElementById(selectId).innerHTML = '';
      }
      map.setCenter(districtData.center);
    });
  };
  amapAdcode.createProvince = function() {//创建省列表
    this.search('country', '中国', 'province');
  };
  amapAdcode.createCity = function(provinceAdcode) {//创建市列表
    this.search('province', provinceAdcode, 'city');
  };
  amapAdcode.createDistrict = function(cityAdcode) {//创建区县列表
    this.search('city', cityAdcode, 'district');
  };
  // 默认启动查询中国
  amapAdcode.createProvince();


  //输入提示
  var autoOptions = {
    input: "tipinput"
  };
  var auto = new AMap.Autocomplete(autoOptions);
  var placeSearch = new AMap.PlaceSearch({
    map: map
  });  //构造地点查询类
  AMap.event.addListener(auto, "select", select);//注册监听，当选中某条记录时会触发
  function select(e) {
    placeSearch.setCity(e.poi.adcode);
    placeSearch.search(e.poi.name);  //关键字查询查询
  }
</script>
</body>
</html>